<%@ page import="com.xju.entity.Order" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>电子商务系统 - 订单确认</title>
  <link rel="stylesheet" type="text/css" href="static/css/style.css">
  <style>
    body {
      margin: 0;
      padding: 0;
      font-family: Arial, sans-serif;
      background-image: url('static/images/img_1.png');
      background-size: cover;
      background-position: center;
      color: white;
    }

    .container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }

    .order-details {
      background-color: rgba(255, 255, 255, 0.9);
      padding: 20px;
      border-radius: 8px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      width: 300px;
      text-align: center;
    }

    .order-details h2 {
      margin-bottom: 20px;
    }

    .order-details p {
      margin: 5px 0;
    }

    .order-details button {
      padding: 10px 20px;
      margin-top: 20px;
      border: none;
      border-radius: 4px;
      cursor: pointer;
      width: 100%;
      background-color: #007bff;
      color: white;
    }

    .order-details button:hover {
      background-color: #0056b3;
    }
  </style>
</head>
<body>
<header>
  <h1>电子商务系统 - 订单确认</h1>
</header>
<main>
  <div class="container">
    <div class="order-details">
      <h2>订单详情</h2>
      <p>订单号: ${order.id}</p>
      <p>下单日期: ${order.order_date}</p>
      <p>总金额: $${order.total_price}</p>
      <p>状态: ${order.status}</p>
      <button onclick="window.location.href='index.jsp'">返回首页</button>
    </div>
  </div>
</main>
<footer>
  <p>&copy; 2023 电子商务系统. All rights reserved.</p>
</footer>
</body>
</html>
